@charset "utf-8";


@import "common/reset";
@import "common/common";

.web{
    height: 100%;
    .main_hot{
        width: 100%;
        height: r(287px);
        overflow: hidden;
        img{
            width: 100%;
        }
    }
    .main_youhui{
        width: 100%;
        margin-top: r(34px);
        line-height: r(54px);
        .icon-flower{
            font-size: r(56px);
            color: $color;
            margin-left: r(21px);
        }
        span{
            color: #000000;
            font-size: r(30px);
        }
        a{
            margin-right: r(21px);           
            float:right;
            span{
                vertical-align: text-top;
                font-size: r(24px);
                img{
                    vertical-align: text-top;
                    width:r(25px);
                    height: r(26px);
                }          
            }
        }
        .main_youhui_img{
            ul{
                li{text-decoration: none;
                    a{                     
                        margin: 0;
                    }
                    float: left;
                    width: r(200px);
                    height: r(80px);
                    img{
                        width: 100%;
                        height: 100%;
                    }
                    &:first-child{
                        margin-left: r(78px);
                        margin-right: r(102px);
                        margin-bottom: r(29px);
                    }
                    &:nth-child(2){
                        margin-bottom: r(29px);
                    }
                     &:nth-child(3){
                        margin-left: r(78px);
                        margin-right: r(102px);
                        margin-bottom: r(29px);
                    }
                }
            }
        }
    }
    .main_caini{
        width: 100%;
        margin-top: r(6.6px);
        margin-bottom: r(22px);
        line-height: r(54px);
        .icon-xin{
            font-size: r(56px);
            color: $color;
            margin-left: r(21px);
        }
        span{
            color: #000000;
            font-size: r(30px);
        }
        a{
            margin-right: r(21px);           
            float:right;
            span{
                vertical-align: text-top;
                font-size: r(24px);
                img{
                    vertical-align: text-top;
                    width:r(25px);
                    height: r(26px);
                }          
            }
        }
    }
    .main_list{
        height: r(164px);
        width: r(647px);
        margin: 0 auto; 
        margin-bottom: r(31px);
        p{
            display: inline-block;
            vertical-align:top;
            font-size: r(30px);
            margin-top: r(28px);
            margin-left: r(10px);
            width: r(420px);
            span{
                float: right;
                color: #494949;
                font-size: r(22px);
            }
            &:nth-child(3){
                font-size: r(22px);
                color: #494949;
                margin-top: r(20px);
            }
            &:nth-child(4){
                margin-top: r(8px);
                font-size: r(18px);
                color: $color;
                span{
                    vertical-align: text-bottom;
                    float: right;
                }
            }
        }      
        .list_img{
            display: inline-block;
            height: r(164px);
            width: r(210px);
            float: left;
            img{
                height: 100%;
                width: 100%;
            }
        }
    }
    main{
        width: 100%;
        overflow-y: scroll;
        position:absolute;
        top: r(149px);
        bottom: r(112px);
    }
    footer{
        width: 100%;
        position: fixed;
        left: 0;
        bottom: 0px;
        padding-top: 5.5px;
        background-color: white;
        &::after{
            content: '';
            width: 100%;
            border-top: 1px solid rgba(7,17,27,.1);
            position: absolute;
            top: 0;
            transform: scaleY(.5);
        }
        ul{
            display: flex;
            width: 100%;
            li{ 
                text-align: center;
                flex: 1;
                a{
                    display:block;
                    color: $color;      
                    div{
                        font-size: r(26px);
                    }     
                    i{
                        font-size: r(70px);
                    }                
                }
            }
        }
    }
}
